<template>
  <el-dialog
    v-loading="loading"
    :visible="visible"
    :append-to-body="true"
    :close-on-click-modal="false"
    :title="$t('crm.components.caa0d482113f64efc3748ef382523e8c')"
    width="700px"
    custom-class="no-padding-dialog"
    @close="handleCancel">
    <log-add
      :id="id"
      ref="logAdd"
      :log-data="data"
      :crm-type="crmType"
      :props="{
        showRelativeAdd: crmType !== 'leads'
      }"
      :crm-relative-props="crmRelativeProps"
      @send="sendLog"
    />
    <span
      slot="footer"
      class="dialog-footer">
      <el-button
        v-debounce="handleConfirm"
        type="primary">{{ $t('crm.components.07bbbe40cd8505ccd364bdb0cf23854f') }}</el-button>
      <el-button @click.native="handleCancel">{{ $t('crm.components.6a8c2e0f5236a1dcf3795fc3c6ee3fe9') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
import {
  crmActivityUpdateAPI
} from '@/api/crm/common'

import LogAdd from './LogAdd'

import ActivityType from './ActivityType'

export default {
  // 跟进记录编辑
  name: 'LogEditDialog',
  components: {
    LogAdd
  },
  props: {
    visible: {
      type: Boolean,
      required: true,
      default: false
    },
    data: Object,
    // 关联业务筛选
    crmRelativeProps: Object
  },
  data() {
    return {
      loading: false,
      crmType: ''
    }
  },
  computed: {
    id() {
      return this.data ? this.data.id : ''
    }
  },
  watch: {
    visible: {
      handler(val) {
        if (val) {
          const newCrmType = ActivityType.methods.getActivityType(this.data.activityType)
          if (this.crmType != newCrmType) {
            this.crmType = newCrmType
          }
        }
      },
      immediate: true,
      deep: true
    }
  },

  methods: {
    /**
     * 发布
     */
    handleConfirm() {
      this.$refs.logAdd.sendClick()
    },

    /**
     * @description: 发送日志
     * @return {*}
     */
    sendLog(data) {
      const params = { ...data }
      params.activityType = this.data.activityType
      params.activityTypeId = this.data.activityTypeId
      params.titleName = this.data.activityTypeName
      params.id = this.id

      this.loading = true
      crmActivityUpdateAPI(params)
        .then(res => {
          this.loading = false
          this.$message.success(this.$t('crm.components.d9136047069dfc9554b52f69f1321e48'))
          this.$emit('save', res.data)
          this.handleCancel()
        })
        .catch(() => {
          this.loading = false
        })
    },

    /**
     * 取消选择
     */
    handleCancel() {
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .log-add {
  height: 55vh;

  .log-content {
    height: 100%;
    overflow-y: auto;
  }
}

.send-btn {
  float: right;
  padding: 5px 9px;
  margin-top: -5px;
  font-size: 12px;
}
</style>
